<template>
  <div>
      <p class="tips">共找到：{{resList.length}} 条数据</p>
    <ul>
     <li @click="toArtical(i._id + 'WOWO')" v-for="i in resList" :key="i._id">
          <div class="img">
            <img :src="i.cover" alt="" />
          </div>
          <div class="info">
            <h3>{{ i.t }}</h3>
          </div>
        </li>
    </ul>
  </div>
</template>

<script>
import qs from 'qs'
export default {
  data() {
      return{
          resList:[]
      }
  },
  methods:{
      toArtical(id){
      this.$router.push("/home/artical/" + id).catch(()=>console.log())
      
      }
  },
  mounted() {
    this.$request({
      url: "/artical/search",
      method:'post',
      data:qs.stringify(
          {
              key:this.$route.query.key
          }
      )
    }).then((success) => {
        this.resList=success.data
    });
  },
};
</script>

<style scoped>
ul {
  margin-top: 20px;
  height: 800px;
}
ul li {
  display: flex;
  padding: 10px;
  overflow: hidden;
  height: 140px;
  margin-bottom: 20px;
  background-color: #f4f4f4;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
  line-height: 1.4;
  cursor: pointer;
}
.tips{
    color: #999aaa;
    font-size: 16px;
}
</style>